<template>
  <div class="home-card">
    <div class="card">
      <div class="card-header d-flex">
        <h6 class="mb-0">{{ slotcenter.title }}</h6>
        <a href class="ml-auto">
          <small>{{ slotcenter.small }}</small>
        </a>
      </div>
      <div class="card-body">
        <template v-if="renderCardType === 'transaction-tips'">
          <tranTips></tranTips>
        </template>
        <template v-else-if="renderCardType === 'warehouse-tips'">
          <warTips></warTips>
        </template>
        <template v-else-if="renderCardType === 'statistics'">
          <statis></statis>
        </template>
        <template v-else-if="renderCardType === 'table'">
          <tableModule></tableModule>
        </template>
        <template v-else>
          <echarts></echarts>
        </template>
      </div>
    </div>
  </div>
</template>



<script>
import tranTips from "./transactionTips";
import warTips from "./warehouseTips";
import statis from "./statistics";
import tableModule from "./table";
import echarts from "./echatrs";
export default {
  props: ["cardType", "slotcenter"],
  components: {
    tranTips,
    warTips,
    statis,
    tableModule,
    echarts
  },
  data() {
    return {
      renderCardType: this.cardType
    };
  },
  created() {}
};
</script>

<style>
</style>